<!DOCTYPE html>
<meta charset="UTF-8">
<title>tabset demo</title>
<link rel="import" href="../../common/layout.html">

<main ng-app="demoApp" ng-controller="TabsetCtrl as tabset">

	<br>

	<cc-tabset active="tabset.activeIndex">

		<cc-tab index="0" title="google">
			<dl>
				<dt>查询的结果共 0 条</dt>
				<dd style="margin-left: 0;">根据您的搜索提示为您推荐 <a href="javascript:;">百度一下>></a></dd>
			</dl>
		</cc-tab>

		<cc-tab index="1" title="facebook">
			<dl>
				<dt>404</dt>
				<dd style="margin-left: 0;">not a found</dd>
			</dl>
		</cc-tab>

		<cc-tab index="2" title="youtube">
			<div ng-controller="TestCtrl as test">
				<input type="text" ng-model="test.name"> <input type="button" value="showName" ng-mousedown="test.alertMe();">
			</div>
		</cc-tab>

    </cc-tabset>

    <br>
    <br>
    <br>
    <br>

	<cc-tabset type="smaller" active="1">

		<cc-tab title="google">
			<dl>
				<dt>查询的结果共 0 条</dt>
				<dd style="margin-left: 0;">根据您的搜索提示为您推荐 <a href="javascript:;">百度一下>></a></dd>
			</dl>
		</cc-tab>

		<cc-tab title="facebook">
			<dl>
				<dt>404</dt>
				<dd style="margin-left: 0;">not a found</dd>
			</dl>
		</cc-tab>

    </cc-tabset>
</main>

<script src="/components.js"></script>
<script>
	angular
		.module('demoApp', [
			'ccms.components',
			'ngResource'
		])
		.controller('TabsetCtrl', function() {
			this.name = 'test';
			this.activeIndex = 0;
		})
		.controller('TestCtrl', function() {
			this.name = 'test';
			this.alertMe = function() {
				alert(this.name);
			}
		});
</script>

